import { CommonForm } from "@/pages/OrderModule/common/components/CommonForm";
import { CommonModal, useModal } from "@/views/components/CommonModal";
import Typography from "@/pages/OrderModule/common/components/Typography";
import { Alert, message, Popconfirm, Space, Row, Col, Button } from "antd";

import { useState } from "react";

// 引用表格组件
import { SimpleTable } from "@/views/components/SearchTable/index";
// 引用表格配置
import { useTableConfig } from "@/views/components/SearchTable/hooks/useTableConfig";
import { batchDeleteGoodsSku } from "../../../service";

/**
 * 从系统店铺商品资料中删除
 *检测到以下 {data.length} 个商品在平台后台已删除，已无法正常同步商品信息，是否从系统店铺商品资料中删除？
 *  */
function ActionModal(props) {
	console.log("ActionModal(props)", props);

	const { onCancel, data } = props;

	function handleOk() {
		const API_DATA = { ids: data.map(e => e.id) };
		batchDeleteGoodsSku(API_DATA).then(res => {
			const { success, data } = res;
			if (success) {
				message.success("删除成功");
			}
		});
	}

	const defaultColumns = [
		{
			name: "序号",
			code: "index",
			render: (t, r, i) => i + 1,
			lock: true,
			width: 60
		},
		{
			name: "平台/店铺",
			code: "ecStoreName",
			width: 200,
			render: (_, record, i) => (
				<>
					<img style={{ width: "24px" }} src={record.ecStoreLogo} /> {record.ecStoreName}
				</>
			)
		},

		{
			title: "款式编码",
			code: "spuCode"
		},
		{
			title: "商品编码",
			code: "skuCode"
		},
		{
			title: "商品图片",
			code: "image",
			render: (_, record, i) => (
				<>
					<img style={{ width: "30px" }} src={record.image} />
				</>
			)
		},
		{
			title: "商品名称",
			code: "skuName"
		},
		{
			title: "价格",
			code: "skuPrice"
		}
	];

	const [columns, setColumns] = useState(defaultColumns);
	const tableRequest = () => {
		return new Promise((resolve, reject) => {
			resolve({
				data,
				success: true
			});
		});
	};
	const { searchSimpleTableProps } = useTableConfig({
		tableKey: "ActionConfirmDeleteShopSkuModal",
		rowKey: "skuCode",
		// ///
		columns,
		tableRequest,
		autoFetch: true,
		hasPagination: false,
		hasQuickSearch: false,
		beforeQuerySearch: false,
		resetSourceData: false,
		hasColsSetting: false
	});

	return (
		<>
			<CommonModal
				title={{ title: "系统提示" }}
				width="80%"
				open={true}
				onCancel={onCancel}
				footer={
					<Row justify="space-between">
						<Col></Col>
						<Col>
							<Space>
								<Button size="middle" type="ghost" onClick={onCancel}>
									暂不处理
								</Button>

								<Popconfirm placement="leftTop" title="是否确定上架？" onConfirm={handleOk} onCancel={() => {}}>
									<Button size="middle" type="primary">
										删除
									</Button>
								</Popconfirm>
							</Space>
						</Col>
					</Row>
				}
			>
				<Alert
					showIcon
					message={
						<Typography as="s1">
							检测到以下 {data.length} 个商品在平台后台已删除，已无法正常同步商品信息，是否从系统店铺商品资料中删除？
						</Typography>
					}
				/>
				<br />
				<SimpleTable {...searchSimpleTableProps} />
			</CommonModal>
		</>
	);
}

export default ActionModal;
